<template>
    <div>
        <div class="logo">
            <img :src="logo" />
        </div>
        <div>
            <van-form @submit="onSubmit">
                <van-field v-model="mobile" name="mobile" label="手机号" placeholder="手机号" :rules="[{ pattern:m_pattern, message: '请填写正确的手机号' }]" />
                <van-field
                    v-model="password"
                    type="password"
                    name="password"
                    label="密码"
                    placeholder="密码"
                    :rules="[{ pattern: p_pattern, message: '密码长度只少6个' }]"
                />
                <div style="margin: 16px;">
                    <van-button square block type="info" native-type="submit">提交</van-button>
                </div>
            </van-form>
        </div>
    </div>
</template>

<script>
import url from '@/config/url'
import logo from '@/assets/image/logo.png'
import Vue from 'vue'
import { Form, Field, Button, Toast } from 'vant'
Vue.use(Form)
Vue.use(Field)
Vue.use(Button)
Vue.use(Toast)
export default {
  data () {
    return {
      mobile: '',
      password: '',
      m_pattern: /^1[3-9]\d{9}$/,
      p_pattern: /[\s\S]{6,}/,
      logo
    }
  },
  methods: {
    onSubmit (values) {
      // console.log("submit", values);
      this.$http.post(url.login, values).then(res => {
        if (res.data.code === 0) {
          const goto = this.$route.query.goto ? decodeURI(this.$route.query.goto) : '/ucenter'
          this.$router.replace(goto)
        }
      })
    }
  }
}
</script>

<style scoped>
.logo {
    margin-top: 30px;
    margin-bottom: 30px;
    text-align: center;
}
</style>
